<!-- 城市组件 -->
<!-- 城市组件 -->
<!-- 城市组件 -->
<template>
  <div class="city">
    <city-header></city-header>
    <city-list :hotList = hotList :sortList = sortList></city-list>
  </div>
</template>

<script>
// 头部区块组件
import CityHeader from './pages/Header'
// 城市首字母集合组件
import CityList from './pages/List'
export default {
  name: 'City',
  components: {
    CityHeader,
    CityList
  },
  data () {
    return {
      hotList: [],
      sortList: {}
    }
  },
  // 借助生命周期函数钩子
  mounted () {
    this.$http.get('/api/city.json')
      .then((res) => {
        const data = res.data.data
        this.hotList = data.hotCities
        this.sortList = data.cities
      // console.log(data);
      })
  }
}
</script>

<style lang="stylus" scoped>
  .city
    background #f5f5f5
</style>
